<%@ page language="java" contentType="text/html; charset=UTF-8" session="true"
    pageEncoding="UTF-8"%>

	<script type="text/javascript" src="lib/mdialog.js"></script>
   	<script type="text/javascript">
   	$(function() {
   		var nominsumo=$("#nominsumo"),codigo=$("#codigo"),descripcion=$("#descripcion"),frmCrear=$("#formulario-nuevo-insumo"),
		allCrear= $([]).add(nominsumo).add(codigo).add(descripcion);
	
	$("button").button();
	$("#tab-insumo").tabs();	
	
	function MensajeError(tips,campo,mensaje){
		campo.addClass('ui-state-error');
		$('.'+tips).addClass('ui-state-highlight');
		$('.'+tips).html(mensaje);
	}
	
	
	function MandarNuevo(Datos){
		$.ajax({
			  url: "CNuevoInsumo",
			  data:Datos, 
			  type: 'post',
			  dataType: 'json',
			  success: function(data){
				  //todo se realizo con éxito
				  if(data.resultado=="10"){
					  DialogoInformacionDiv('crear-ins','Datos ingresados','Datos guardados con éxito');	
					  frmCrear.dialog("close");
				  	
				  }else{//repetido
				  		MensajeError('tipsNuevoInsumo',$("#"+data.campo),data.mensaje);
				  	}
		  	}  
			});		
						
	}
		
	/*formulario*/
	frmCrear.dialog({
		autoOpen:false,
		height: 'auto',
		width: 'auto',
		modal:true,
		closeOnEscape:true,
		buttons:{
			"Cancelar": function(){
				$(this).dialog('close');
			},
			"Guardar": function(){
				MandarNuevo(
					{
						nominsumo:nominsumo.val(),
						codigo:codigo.val(),
						descripcion:descripcion.val()
					}		
				);
			}
		}
	});
	
	
	/*Crear insumo*/
	$("#crear_insumo").click(function(){
		allCrear.val('');
		allCrear.removeClass('ui-state-error');
		$('.tipsNuevoInsumo').html('* Campos obligatorios');
		$('.tipsNuevoInsumo').removeClass('ui-state-highlight');
		frmCrear.dialog({position:'center'});
		frmCrear.dialog({show:'fade'});
		frmCrear.dialog({hide:'fade'});
		frmCrear.dialog('open');
	});
   	
   	});
   	</script>
   			
	<button id="crear_insumo">Crear Insumo</button>
		<div id="crear-ins" title=""></div> 
		 
		<div id="formulario-nuevo-insumo" title="Crear nuevo insumo">
		<h3 style="text-align:center" class="tipsNuevoInsumo">* Campos obligatorios</h3>
		<table class="formulario">
		<tr>
			<td>*</td>
			<td class="ui-widget">Nombre:</td>
			<td class="ui-state-focus"><input id="nominsumo" size="99"/> </td>			
		</tr>
		
		<tr>
			<td></td>
			<td class="ui-widget">Código</td>
			<td class="ui-state-focus"><input id="codigo" size="40"/> </td>
		</tr>
		
		<tr>
			<td></td>
			<td class="ui-widget">Descripción:</td>
			<td class="ui-state-focus"><input id="descripcion" size="80"/> </td>			
		</tr>
		</table>
		
		</div>
   			